import React, { Component } from 'react';
import { connect } from 'dva';
import { ObjectType } from '../utils';
import { getUserLevel } from './service';
import FinanceAdjustmentInquiryPage from './inquiryPage';
import FinanceAdjustmentDetailPage from './detailPage';
import ExamineResultPage from '../../../components/OperationResultPage';

class FinanceAdjustment extends Component<ObjectType, ObjectType> {
  constructor(props: ObjectType) {
    super(props);
    this.state = {
      detailPageData: {},
      userLevel: '',
      showExamineResult: false,
      examineStatus: false, // 审核返回结果
      option: '',
      showInquiryPage: true,
      message: '', // 审核失败信息
    };
  }

  // 点击审核或者查看进入详情页面
  toDetailPage = (record: ObjectType) => {
    if (record && record.userId) {
      getUserLevel({ userId: record.userId }).then((data: ObjectType) => {
        if (data.code === 1) {
          this.setState({
            detailPageData: record,
            userLevel: data.data,
            showInquiryPage: false,
          });
        }
      });
    }
  };

  // 返回查询页面
  toInquiryPage = () => {
    this.setState({
      showInquiryPage: true,
      showExamineResult: false,
      userLevel: '',
    });
  };

  // 跳转到审核结果页面
  toExamineResultPage = (b: number, option: string, message: string | undefined) => {
    this.setState({
      showExamineResult: true,
      examineStatus: b,
      option,
      message,
    });
  };

  render() {
    const {
      detailPageData,
      userLevel,
      showExamineResult,
      examineStatus,
      option,
      showInquiryPage,
      message,
    } = this.state;
    const showDetailPage = showInquiryPage && !userLevel;
    const { username, orderId, amount } = detailPageData;
    const successMsg = `${username}-${orderId}-金额${amount}-${option}`;
    return (
      <div>
        {!showExamineResult ? (
          <>
            {showDetailPage ? (
              <FinanceAdjustmentInquiryPage toDetailPage={this.toDetailPage} />
            ) : (
              // @ts-ignore
              <FinanceAdjustmentDetailPage
                detailPageData={detailPageData}
                toInquiryPage={this.toInquiryPage}
                userLevel={userLevel}
                toExamineResultPage={this.toExamineResultPage}
              />
            )}
          </>
        ) : (
          <ExamineResultPage
            goBack={this.toInquiryPage}
            isSuccess={examineStatus}
            message={examineStatus ? successMsg : `状态码:0  审核状态：修改失败 ${message}`}
          />
        )}
      </div>
    );
  }
}

function mapStateToProps({
  financeAdjustmentExamine: { tableData, formData },
}: {
  financeAdjustmentExamine: ObjectType;
}) {
  return { tableData, formData };
}

export default connect(mapStateToProps)(FinanceAdjustment);
